/**
 * 弹出层工具函数
 * 使用jQuery Modal插件，HTML模板与JavaScript完全分离
 * 避免在JavaScript中写任何HTML代码
 */

// 弹出层工具对象
window.ModalUtils = {
    
    /**
     * 显示确认对话框
     * @param {string} message - 确认消息
     * @param {function} onConfirm - 确认回调
     * @param {function} onCancel - 取消回调
     * @param {string} title - 标题（可选）
     */
    showConfirm: function(message, onConfirm, onCancel, title) {
        // 检查是否存在确认对话框模板
        if ($('#confirm-dialog-template').length === 0) {
            console.error('确认对话框模板不存在');
            return;
        }
        
        // 克隆模板
        const $modal = $('#confirm-dialog-template').clone();
        $modal.attr('id', 'confirm-dialog-' + Date.now());
        $modal.removeClass('template-hidden');
        
        // 设置内容
        if (title) {
            $modal.find('.modal-title').text(title);
        }
        $modal.find('.modal-message').text(message);
        
        // 绑定事件
        $modal.find('.btn-confirm').off('click').on('click', function() {
            $.modal.close();
            if (typeof onConfirm === 'function') {
                onConfirm();
            }
        });
        
        $modal.find('.btn-cancel').off('click').on('click', function() {
            $.modal.close();
            if (typeof onCancel === 'function') {
                onCancel();
            }
        });
        
        // 显示模态框
        $modal.appendTo('body').modal({
            fadeDuration: 300,
            showClose: true
        });
        
        return $modal;
    },
    
    /**
     * 显示提示信息
     * @param {string} message - 提示消息
     * @param {string} type - 类型：success, error, warning, info
     * @param {function} callback - 回调函数
     * @param {string} title - 标题（可选）
     */
    showAlert: function(message, type, callback, title) {
        const templateId = '#alert-dialog-template';
        
        // 检查是否存在提示对话框模板
        if ($(templateId).length === 0) {
            console.error('提示对话框模板不存在');
            return;
        }
        
        // 克隆模板
        const $modal = $(templateId).clone();
        $modal.attr('id', 'alert-dialog-' + Date.now());
        $modal.removeClass('template-hidden');
        
        // 设置类型样式
        $modal.removeClass('alert-success alert-error alert-warning alert-info');
        $modal.addClass('alert-' + type);
        
        // 设置内容
        if (title) {
            $modal.find('.modal-title').text(title);
        }
        $modal.find('.modal-message').text(message);
        
        // 绑定事件
        $modal.find('.btn-ok').off('click').on('click', function() {
            $.modal.close();
            if (typeof callback === 'function') {
                callback();
            }
        });
        
        // 显示模态框
        $modal.appendTo('body').modal({
            fadeDuration: 300,
            showClose: true
        });
        
        return $modal;
    },
    
    /**
     * 显示表单对话框
     * @param {string} templateId - 表单模板ID
     * @param {object} options - 配置选项
     */
    showForm: function(templateId, options) {
        const defaults = {
            title: '表单',
            onSubmit: null,
            onCancel: null,
            data: {}
        };
        
        const opts = $.extend({}, defaults, options);
        
        // 检查是否存在表单模板
        if ($(templateId).length === 0) {
            console.error('表单模板不存在: ' + templateId);
            return;
        }
        
        // 克隆模板
        const $modal = $(templateId).clone();
        $modal.attr('id', templateId.replace('#', '') + '-' + Date.now());
        $modal.removeClass('template-hidden');
        
        // 设置标题
        if (opts.title) {
            $modal.find('.modal-title').text(opts.title);
        }
        
        // 填充数据
        if (opts.data) {
            for (const key in opts.data) {
                const $field = $modal.find('[name="' + key + '"]');
                if ($field.length > 0) {
                    $field.val(opts.data[key]);
                }
            }
        }
        
        // 绑定提交事件
        $modal.find('.btn-submit').off('click').on('click', function() {
            if (typeof opts.onSubmit === 'function') {
                const formData = {};
                $modal.find('input, select, textarea').each(function() {
                    const $this = $(this);
                    const name = $this.attr('name');
                    if (name) {
                        formData[name] = $this.val();
                    }
                });
                
                const result = opts.onSubmit(formData, $modal);
                // 如果回调返回false，不关闭对话框
                if (result !== false) {
                    $.modal.close();
                }
            } else {
                $.modal.close();
            }
        });
        
        // 绑定取消事件
        $modal.find('.btn-cancel').off('click').on('click', function() {
            $.modal.close();
            if (typeof opts.onCancel === 'function') {
                opts.onCancel();
            }
        });
        
        // 显示模态框
        $modal.appendTo('body').modal({
            fadeDuration: 300,
            showClose: true
        });
        
        return $modal;
    },
    
    /**
     * 显示自定义模态框
     * @param {string} templateId - 模板ID
     * @param {object} options - 配置选项
     */
    showCustom: function(templateId, options) {
        const defaults = {
            data: {},
            onShow: null,
            onHide: null
        };
        
        const opts = $.extend({}, defaults, options);
        
        // 检查是否存在模板
        if ($(templateId).length === 0) {
            console.error('模板不存在: ' + templateId);
            return;
        }
        
        // 克隆模板
        const $modal = $(templateId).clone();
        $modal.attr('id', templateId.replace('#', '') + '-' + Date.now());
        $modal.removeClass('template-hidden');
        
        // 显示模态框
        $modal.appendTo('body').modal({
            fadeDuration: 300,
            showClose: true
        });
        
        // 调用显示回调
        if (typeof opts.onShow === 'function') {
            opts.onShow($modal, opts.data);
        }
        
        return $modal;
    },
    
    /**
     * 关闭当前模态框
     */
    close: function() {
        if ($.modal && $.modal.close) {
            $.modal.close();
        }
    },
    
    /**
     * 关闭所有模态框
     */
    closeAll: function() {
        $('.jquery-modal').remove();
        $('.modal').remove();
    }
};

// 提供便捷的全局方法
window.showConfirm = function(message, onConfirm, onCancel, title) {
    return ModalUtils.showConfirm(message, onConfirm, onCancel, title);
};

window.showSuccess = function(message, callback, title) {
    return ModalUtils.showAlert(message, 'success', callback, title || '成功');
};

window.showError = function(message, callback, title) {
    return ModalUtils.showAlert(message, 'error', callback, title || '错误');
};

window.showWarning = function(message, callback, title) {
    return ModalUtils.showAlert(message, 'warning', callback, title || '警告');
};

window.showInfo = function(message, callback, title) {
    return ModalUtils.showAlert(message, 'info', callback, title || '提示');
};

window.showFormDialog = function(templateId, options) {
    return ModalUtils.showForm(templateId, options);
};

window.showCustomDialog = function(templateId, options) {
    return ModalUtils.showCustom(templateId, options);
};

window.closeModal = function() {
    return ModalUtils.close();
};

window.closeAllModals = function() {
    return ModalUtils.closeAll();
};
